{%extends 'df_goods/base.html'%}

{%block head%}


    {% if request.session.user_name|default: '' != '' %}
        <script>
            $(function () {
               f();
            });
            function f() {  //进入页面时刷新购物车数量  规定此时商品id和数量都为0
                 $.get('/cart/add0_0/', function (data) {
                    $('#show_count').text(data.count);
                });
            }
        </script>
    {% endif %}



<script>
	function add() {
		num = parseFloat($('.num_show').val());
		$('.num_show').val(num+1);
		$('.num_show').blur();
	}
	function minus() {
		num = parseFloat($('.num_show').val());
		if(num<=1){
			return;
		}
		$('.num_show').val(num-1);
		$('.num_show').blur();
	}
	$(function () {
		$('.num_show').blur(function () {
			num = parseInt($('.num_show').val());
			if(num<=1){
				//$('.num_show').val(num=1);
				num=1;
			}
			price = parseFloat($('#gprice').text());
			totle = num*price;
			$('.num_show').val(num)
			$('#gtotal').text(totle.toFixed(2)+'元');
			// $('#add_cart').attr('href', '/cart/add'+$('#gid').val()+'_'+num+'/');
		});
	});
</script>
{%endblock head%}

{%block detail%}
	<div class="goods_detail_con clearfix">
		<div class="goods_detail_pic fl"><img src="/static/{{g.gpic}}"></div>

		<div class="goods_detail_list fr">
			<h3>{{g.gtitle}}</h3>
			<p>{{g.gsubtitle}}</p>
			<div class="prize_bar">
				<span class="show_pirze">¥<em id="gprice">{{g.gprice}}元</em></span>
				<span class="show_unit">单  位：{{g.gunit}}</span>
			</div>
			<div class="goods_num clearfix">
				<div class="num_name fl">数 量：</div>
				<div class="num_add fl">
					<input type="text" class="num_show fl" value="1">
					<a href="javascript:add();" class="add fr">+</a>
					<a href="javascript:minus();" class="minus fr">-</a>
				</div> 
			</div>
			<div class="total">总价：<em id="gtotal">{{g.gprice}}元</em></div>
			<div class="operate_btn">
				<a href="javascript:;" class="buy_btn">立即购买</a>
				<a href="javascript:;" class="add_cart" id="add_cart" >加入购物车</a>
			</div>
		</div>
	</div>

{%endblock detail%}

{%block detail2%}
		<div class="r_wrap fr clearfix">
			<ul class="detail_tab clearfix">
				<li class="active">商品介绍</li>
				<li>评论</li>
			</ul>
			<div class="tab_content">
				{{g.gcontent|safe}}
			</div>
		</div>

	<div class="add_jump"></div>

	<script type="text/javascript">
		$add_x = $('#add_cart').offset().top;
		$add_y = $('#add_cart').offset().left;

		$to_x = $('#show_count').offset().top;
		$to_y = $('#show_count').offset().left;

		$(".add_jump").css({'left':$add_y+80, 'top':$add_x+10, 'displace': block})
		$('#add_cart').click(function () {
		//	判断是否登录，若未登录则提示先登录
			if($('.login_btn').text().indexOf('登录')>=0){
				alert('请先登录后再购买');
				location.href='/user/login/';
				return;
			}
		//	动画效果
			$('.add_jump').stop().animate({
				'left': $to_y+7,
				'top': $to_x+7},
				"fast", function () {
					$(".add_jump").fadeOut('fast',function () {});
			});
			//异步
			num=parseInt($('.num_show').val());
			$.get('/cart/add{{g.id}}_'+num+'/',function (data) {
				$('#show_count').text(data.count);
			})
			$('#add_cart').attr('href', '/cart/add'+$('#gid').val()+'_'+num+'/');
		})

	</script>


{%endblock detail2%}